<?php
require_once ("facebook-php-sdk-master/src/facebook.php");
require_once '../script/php_class/DrawView.php';
require_once 'fb_setting.php';
require_once 'facebookAlbums.php';
require_once 'HTTP/Request2.php';

Facebook::$CURL_OPTS[CURLOPT_SSL_VERIFYPEER] = false;
Facebook::$CURL_OPTS[CURLOPT_SSL_VERIFYHOST] = 2;
$id = $_GET['pm'];
$setting = new Setting();
$facebook = new Facebook($setting->getLicence());
?>
<!DOCTYPE html>
<html dir="ltr" lang="ja">
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="">
		<meta name="description" content="">
		<meta name="keywords" content="">
		<title>Photorana - Solbum</title>
		<link rel="stylesheet" href="css/style_contents.css" type="text/css" media="screen">
		<link rel="stylesheet" href="css/pict_panel_style.css" type="text/css" media="screen">
		<link rel="stylesheet" type="text/css" href="css/simptip.css" />
		<link rel="stylesheet" type="text/css" href="../script/js/fotorama.css" />
		<!--<link rel="stylesheet" href="../script/jq/flexslider.css" type="text/css">-->
		<!--[if lt IE 9]>
		<script src="js/html5.js"></script>
		<script src="js/css3-mediaqueries.js"></script>
		<![endif]-->
		<!--<script src="../js/jquery1.7.2.min.js"></script>-->
		<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
		<script src="../js/script.js"></script>
		<script src="../script/jq/footer_fixed.js"></script>
		<script type="text/javascript" src="../script/js/toast.js"></script>
		<script type="text/javascript" src="../script/js/form_check.js"></script>
		<script type="text/javascript" src="../script/js/name_check.js"></script>
		<script type="text/javascript" src="../script/js/fotorama.js"></script>
		<script>
			$(document).ready(function() {
				var play = 0;
				$("ul[data-liffect] li").shuffleElements().each(function(i) {
					$(this).attr("style", "-webkit-animation-delay:" + i * 120 + "ms;"
									+ "-moz-animation-delay:" + i * 120 + "ms;"
									+ "-o-animation-delay:" + i * 120 + "ms;"
									+ "animation-delay:" + i * 120 + "ms;");
					play++;
					if (play === $("ul[data-liffect] li").size()) {
						$("ul[data-liffect]").addClass("play");
					}
				});
			});
			function GetQueryString() {
				if (1 < window.location.search.length) {
					var query = window.location.search;
					var parameters = query.split('&');
					var result = new Object();
					for (var i = 0; i < parameters.length; i++) {
						var element = parameters[i].split('=');
						var paramName = decodeURIComponent(element[0]);
						var paramValue = decodeURIComponent(element[1]);
						// パラメータ名をキーとして連想配列に追加する
						result[paramName] = decodeURIComponent(paramValue);
					}
					return result;
				}
				return null;
			}

			jQuery.fn.shuffleElements = function() {
				var o = $(this);
				for (var j, x, i = o.length; i; j = parseInt(Math.random() * i), x = o[--i], o[i] = o[j], o[j] = x)
					;
				return o;
			};
			jQuery.bind();

		</script>

	</head>
	<body onload="">
		<div id="slogan"><h1 class="inner">SNS Album Service - Solbum - </h1></div>
		<!-- Head -->
		<div id="header">
			<div class="inner">
				<!-- Logo -->
				<div class="logo">
					<a href="index.php">Solbum<br><span>Sharing Photo Engine</span></a>
				</div>
				<!-- / Logo -->
				<!-- Navigation Main -->
				<nav id="mainNav">
					<a class="menu" id="menu"><span>MENU</span></a>
					<div class="panel">
						<ul>
							<li><a href="index.php">
									<img src="../images/home.png" width="30" height="30" alt=""><br><span>HOME</span></a></li>
							<li><a href="#">
									<img src="../images/albums.png" width="30" height="30" alt="" onClick="history.go(-1);
				return false;"><br>
									<span>Albums</span></a></li>
							<li><a href="#">
									<img src="../images/refresh.png" width="30" height="30" alt="" onClick="location.reload();
				return false;"><br>
									<span>Update</span></a></li>
							<li><a href="setting.html">
									<img src="../images/setting.png" width="30" height="30" alt=""><br><span>Setting</span></a></li>
						</ul>
					</div>
				</nav>
				<!-- / Navigation Main -->
			</div>
		</div>
		<!-- / Headー -->


		<div id="hr"><hr></div>
		<!--<div id="pict_album">-->
		<!-- Column4 -->
		<div id="mainPict">
			<div class="fotorama" data-width="100%" data-allowfullscreen="native" data-transition="crossfade"  data-fit="contain"
					 data-height="50%" data-nav="thumbs" data-keyboard="true" data-autoplay="true">
				
				<?php
//				Facebook::$CURL_OPTS[CURLOPT_SSL_VERIFYPEER] = false;
//				Facebook::$CURL_OPTS[CURLOPT_SSL_VERIFYHOST] = 2;
//				$id = $_GET['pm'];
//				$setting = new Setting();
//				$facebook = new Facebook($setting->getLicence());
				$facebookAlbums = new FacebookAlbums($facebook, $facebook->getAccessToken(), $facebook->getUser());
				//list取得
				$list = $facebookAlbums->getFacebookAlbumPhotos($id);
				foreach ($list as $item) {
					DrawView::drawPicture($item['image'], $item['album_id']);
				}
				?>
			</div>
		</div>
		<!-- / Column4 -->

		<!--</div>-->
		<!-- / WRAPPER -->

		<!-- Footerー -->
		<div id="footer">
			<div class="inner">

				<!-- Column3 -->
				<section class="gridWrapper">

					<article class="grid">
						<!-- Logo -->
						<p class="logo"><a href="index.php">Alloc<br /><span>Change Your Photo Life</span></a></p>
						<!-- / Logo -->
					</article>

					<article class="grid">
						<!-- Tell toka -->
						<p class="tel">Tell: <strong>XXX-XXX=XXXX</strong></p>
						<p>Information: AM 10:00 〜 PM 5:00</p>
						<!-- / Tell toka -->
					</article>

					<article class="grid copyright">
						Copyright(c) 2013 Alloc Inc. All Rights Reserved. Design by <a href="http://google.com" target="_blank" rel="nofollow">Alloc</a>
					</article>

				</section>
				<!-- Column3 -->

			</div>
		</div>
		<!-- / Footer -->

	</body>
</html>